<template>
	<view class="content" v-if="show==1">
		<view class="news" >
			<view class="goods4" v-for="(g,index) in goods" :style="'right:'+g.right+'px;'" :data-index="index" @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd">
				<view class="orders" @click="gurl" :data-id="g.id" :data-index="index">
					<view style="width:100%;display: flex;">
					<image :src="g.avatar" mode="aspectFit" class="touxiang"></image>
					<view class="goods4-2" >
						<view class="goods4-3">
							<view class="fenlei" style="width:100%;">{{g.cate2}}</view>
						</view>
						<view class="goods4-3">
							<view class="shengfen" style="width:100%;">T{{g.teacher_id}}-{{g.nickname}}</view>
							
						</view>
						<view class="goods4-3">
							<view class="shengfen">{{g.nianji}}</view>
							<view class="zhuangtai" style="color:red;">{{zdtype==1?'㉿':'￥'}}{{g.price}}</view>
						</view>
						<view class="goods4-3">
							<view class="shengfen">{{g.fuwu_cate}}</view>
							<view class="zhuangtai">已售{{g.sales}}</view>
						</view>
					</view>
					</view>
					<view class="weizhi">
						<image src="../../static/images/map3.png" mode="aspectFill"></image>
						<view class="weizhi2">{{g.address}}</view>
					</view>
				</view>
				<view class="remove">
					<view class="remove2" v-if="g.status<3" @click="del" :data-index="index">删除</view>
					<view class="remove5" v-if="g.status==3" @click="del" :data-index="index">删除</view>
					<view class="remove4" v-if="g.status==2" @click="shangjia" :data-index="index">上架</view>
					<view class="remove3" v-if="g.status==1" @click="xiajia" :data-index="index">下架</view>
				</view>
			</view>
		</view>
		<view class="empty" v-if="!goods[0]">暂无任何数据</view>
	</view>
</template>

<script>
	var app=getApp();
	export default {
		data() {
			return {
				show:0,
				goods:[],
				type:0,
				zdtype:0,
				page:1,
				startX :0,
				delBtnWidth: 80,
				next:0
			}
		},
		onLoad(op) {
			const uid = uni.getStorageSync('uid');
			if(app.isBlank(uid)==true){
				app.error_msg("请先登录");
			}
			var that=this;
			//#ifdef APP-PLUS
			uni.getSystemInfo({
			    success: function (res) {
					if(res.platform=='ios'){
						//that.zdtype=1;
					}
			    }
			});
			//#endif
			if(app.isBlank(op.type)==false){
				this.type=op.type;
			}
			this.uid=uid;
			this.getdata();
		},
		methods: {
			getdata(t=0){
				var that=this;
				uni.showLoading({
				    title: '数据加载中'
				});
				uni.request({
				    url: app.globalData.url+"laoshi/kc",
					method:"POST",
					dataType:"json",
					header: {
					    'content-type': 'application/x-www-form-urlencoded'
					},
				    data: {page:that.page,uid:that.uid,type:that.type},
				    success: (res) => {
						uni.hideLoading();
						if(res.data.code!=1){
							app.error_msg(res.data.msg);
						}
						if(t==1){
							that.goods=res.data.data.goods
						}else{
						that.goods=that.goods.concat(res.data.data.goods)
						}
						that.next=res.data.data.next
						that.page++
						that.show=1;
				    }
				});
			},
			drawStart(e) {
				var touch = e.touches[0];
				this.startX = touch.clientX;
			},
			//触摸滑动
			drawMove(e) {
				for (var index in this.goods) {
					this.goods[index].right=0;
				}
				var touch = e.touches[0];
				var item = this.goods[e.currentTarget.dataset.index];
				var disX = this.startX - touch.clientX;
				if (disX >= 20) {
					if (disX > this.delBtnWidth) {
						disX = this.delBtnWidth;
					}
					this.goods[e.currentTarget.dataset.index].right=disX;
				} else {
					this.goods[e.currentTarget.dataset.index].right=0;
				}
			},
			//触摸滑动结束
			drawEnd(e) {
				var item = this.goods[e.currentTarget.dataset.index];
				if (item.right >= this.delBtnWidth / 2) {
					this.goods[e.currentTarget.dataset.index].right=this.delBtnWidth;
				} else {
					this.goods[e.currentTarget.dataset.index].right=0;
				}
			},
			del(e){
				var that=this;
				var index=e.currentTarget.dataset.index;
				var id=this.goods[index].id
				uni.showModal({
				    content: '确定要删除该课程吗？',
				    success: function (res) {
				        if (res.confirm) {
				            uni.showLoading({
				                title: '删除中'
				            });
				            uni.request({
				                url: app.globalData.url+"laoshi/kc_del",
				            	method:"POST",
				            	dataType:"json",
				            	header: {
				            	    'content-type': 'application/x-www-form-urlencoded'
				            	},
				                data: {uid:that.uid,id:id},
				                success: (res) => {
				            		uni.hideLoading();
				            		if(res.data.code!=1){
				            			uni.showToast({
				            			    title: res.data.msg,
				            				icon:'none',
				            			    duration: 1500
				            			});
				            			return false;
				            		}
				            		uni.showToast({
				            		    title: res.data.msg,
				            			icon:'success',
				            		    duration: 1000
				            		});
				            		that.goods.splice(index,1);
				                }
				            });
				        }
				    }
				});
				
			},
			xiajia(e){
				var that=this;
				var index=e.currentTarget.dataset.index;
				var id=this.goods[index].id
				uni.showModal({
				    content: '确定要下架该课程吗？',
				    success: function (res) {
				        if (res.confirm) {
				            uni.showLoading({
				                title: '下架中'
				            });
				            uni.request({
				                url: app.globalData.url+"laoshi/kc_xiajia",
				            	method:"POST",
				            	dataType:"json",
				            	header: {
				            	    'content-type': 'application/x-www-form-urlencoded'
				            	},
				                data: {uid:that.uid,id:id},
				                success: (res) => {
				            		uni.hideLoading();
				            		if(res.data.code!=1){
				            			uni.showToast({
				            			    title: res.data.msg,
				            				icon:'none',
				            			    duration: 1500
				            			});
				            			return false;
				            		}
				            		uni.showToast({
				            		    title: res.data.msg,
				            			icon:'success',
				            		    duration: 1000
				            		});
									that.goods[index].right=0;
				            		that.goods[index].status=2;
				                }
				            });
				        }
				    }
				});
				
			},
			shangjia(e){
				var that=this;
				var index=e.currentTarget.dataset.index;
				var id=this.goods[index].id
				uni.showModal({
				    content: '确定要上架该课程吗？',
				    success: function (res) {
				        if (res.confirm) {
				            uni.showLoading({
				                title: '上架中'
				            });
				            uni.request({
				                url: app.globalData.url+"laoshi/kc_shangjia",
				            	method:"POST",
				            	dataType:"json",
				            	header: {
				            	    'content-type': 'application/x-www-form-urlencoded'
				            	},
				                data: {uid:that.uid,id:id},
				                success: (res) => {
				            		uni.hideLoading();
				            		if(res.data.code!=1){
				            			uni.showToast({
				            			    title: res.data.msg,
				            				icon:'none',
				            			    duration: 1500
				            			});
				            			return false;
				            		}
				            		uni.showToast({
				            		    title: res.data.msg,
				            			icon:'success',
				            		    duration: 1000
				            		});
									that.goods[index].right=0;
				            		that.goods[index].status=1;
				                }
				            });
				        }
				    }
				});
				
			},
			cz(index,kc){
				this.goods[index].title=kc['title'];
				this.goods[index].cate=kc['cate'];
				this.goods[index].cate2=kc['cate2'];
				this.goods[index].sheng=kc['sheng'];
				this.goods[index].nianji=kc['nianji'];
				this.goods[index].price=kc['price'];
				this.goods[index].address=kc['address'];
			},
			gurl(e){
				var id=e.currentTarget.dataset.id;
				var index=e.currentTarget.dataset.index;
				uni.navigateTo({
				    url: '/pages/teacher/kcedit?id='+id+'&index='+index
				});
			},
			onReachBottom(){
				if(this.next==1){
					this.next=0;
					this.getdata();
				}
			}
		}
	}
</script>

<style>
	.weizhi2{width:100%;height:25px;line-height: 25px;flex:1;overflow: hidden;}
	.weizhi image{width:15px;height:15px;margin-top: 5px;}
	.weizhi{width:100%;height:25px;display: flex;}
	.touxiang{width:100px;height:100px;margin-right: 10px;border-radius: 5px;}
	.remove5{width:100%;height:140px;font-size: 16px;line-height: 140px;text-align: center;color:#fff;background-color: red;}
	.remove4{width:100%;height:70px;font-size: 16px;line-height: 70px;text-align: center;color:#fff; background-color:#0f3cfd;}
	.remove3{width:100%;height:70px;font-size: 16px;line-height: 70px;text-align: center;color:#fff; background-color:#fca000;}
	.remove2{width:100%;height:70px;font-size: 16px;line-height: 70px;text-align: center;color:#fff;background-color: red;}
	.remove {
		    width: 80px;
		    height: 100%;
		    color: white;
		    position: absolute;
		    top: 0;
		    right: -80px;
			
		}
	.orders{width:100%;}
	
	.empty{width:100%;margin-top: 30%;text-align: center;}
	
	page{background-color: rgb(245, 245, 245);}
	.goods44{width:100%;overflow: hidden;}
	.goods4-9{width:100%;height:25px;line-height: 25px;color:#666;overflow: hidden;}
	.goods4-8 text{color:#666;font-size: 0.8rem;}
	.goods4-8{width:100%;height:25px;line-height: 25px;overflow: hidden;}
	.goods4-7{width:70%;height:50px;float: left;}
	
	.goods4-4{width:30%;height:50px;float: left;line-height: 50px;text-align: center;color:#fe2424;font-size: 1.5rem;}
	.guanjianci{width:100%;height:25px;line-height: 25px;overflow: hidden;}
	.zhuangtai{width:30%;height:25px;line-height: 25px;text-align: right;float: left;}
	.shengfen{width:70%;height:25px;line-height: 25px;overflow: hidden;float: left;}
	.nianji{width:30%;height:25px;line-height: 25px;text-align: right;float: left;}
	.fenlei{width:70%;height:25px;line-height: 25px;overflow: hidden;font-weight: 600;font-size: 0.9rem;float: left;}
	.goods4-3{width:100%;overflow: hidden;}
	.goods4-2{width:100%;flex: 1;}
	.goods4-1{width:120px;height:80px;border-radius: 5px;margin-right: 10px;}
	.goods4{width:96%;padding: 10px 2%;border-radius: 5px;display: flex;position: relative;background-color: #fff;margin: 8px 0px;padding-bottom: 4px;}
	.news{width:94%;margin:0px 3%;overflow: hidden;}
	
</style>
